<!DOCTYPE html>
<html dir="ltr">

<head>
  <meta charset="UTF-8">
  <title>Item Sliding - Standalone</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <script src="/dist/ionic.js"></script>
</head>

<body>
  <ion-item-sliding>
    <ion-item>
      <ion-label>
        One Line, icon only
      </ion-label>
    </ion-item>
    <ion-item-options>
      <ion-item-option color="secondary">
        <ion-icon slot="icon-only" name="heart"></ion-icon>
      </ion-item-option>
      <ion-item-option color="danger">
        <ion-icon slot="icon-only" name="close"></ion-icon>
      </ion-item-option>
    </ion-item-options>
  </ion-item-sliding>

  <ion-item-sliding>
    <ion-item>
      <ion-label>
        One Line, icon and text
      </ion-label>
    </ion-item>
    <ion-item-options>
      <ion-item-option color="primary">
        <ion-icon name="more"></ion-icon>
        <span class="more-text">More</span>
      </ion-item-option>
      <ion-item-option color="secondary">
        <ion-icon name="archive"></ion-icon>
        <span class="archive-text">Archive</span>
      </ion-item-option>
    </ion-item-options>
  </ion-item-sliding>
</body>
</html>
